$(function(){
    $('#header').eq(0).click(function(){
        location.href='../index.html'
    })
    let ownPage=document.querySelector('.subNav>a:nth-of-type(3)')
    let title=getQueryString('title')
    let categoryid=getQueryString('categoryid')
    let product = document.querySelector('#product>.product')
    let src
    let page=document.querySelector("#select>.page")
    let str=''
    $('.btnLeft').attr('disabled','disabled')
    fetch('http://chst.vip:1234/api/getproductlist?categoryid='+categoryid+'&title='+title)
    .then(body=>body.json())
    .then(res=>{
        let productStr = ""
            res.result.forEach(item => {
                let regExp = /(\/|http)[^>]+\.(jpg|jpeg|png|gif)/g;
                src = item.productImg.match(regExp)
                src=src?src[0]:item.productImg
                productStr += `<li productid=${item.productId}>
        <img src=${src}>
        <div>
            <p>${item.productName}<br><span>${item.productPrice}</span></p>
            <div>
                <span>${item.productQuote}</span>
                <div>
                    <img src="../assets/images/讯息.png">
                    <span>${item.productCom}</span>
                </div>
            </div>
        </div>
    </li>`
            })
            let total =Math.ceil(res.totalCount/10)
            for(var i=0;i<total;i++){
                 str+=`<option value=${i+1}/${total} pageid=${i}>${i+1}/${total}</option>`
            }
            product.innerHTML = productStr
            page.innerHTML=str
            let lis=document.querySelectorAll('#product>.product>li')
            // let uu =document.querySelector('#product>.product')
            
            for(var k=0;k<lis.length;k++){
                lis[k].onclick=function(){
                    let id=this.getAttribute('productid')
                    location.href='./bjsearchListDetail.html?productid='+id+'&categoryid='+categoryid+'&title='+title
                }
            }

            let sel = document.querySelector('.page')
            let options=document.querySelectorAll("#select>.page>option")
            let val
            var values
            $('.btnLeft').click(function(){
                $('.btnRight').removeAttr('disabled')
                val=$("#select").find("select").find('option:selected').attr("pageid");
                val--
                // console.log(val)
                if(val<=0){
                    val=0
                }
                if(val==0){
                    $('.btnLeft').attr('disabled','disabled')
                }
                values=val+1+'/'+total
                // console.log(values)
                $("#select").find("select").find("option[value = '"+values+"']").prop("selected",true).siblings().removeProp('selected')
                sendFetch(val-0+1)
                // uu.onclick=function(e){
                //     if(e.target.localName=='img'){
                //         var _this=e.target
                //         let id=_this.parentNode.getAttribute('productid')
                //         location.href='saveMoneyDetail.html?productid='+id
                //     }else if(e.target.localName=='p'){
                //         id=e.target.parentNode.parentNode.getAttribute('productid')
                //         location.href='saveMoneyDetail.html?productid='+id
                //     }
                // }
            })
            $('.btnRight').click(function(){
                $('.btnLeft').removeAttr('disabled')
                val=$("#select").find("select").find('option:selected').attr("pageid");
                val++
                if(val+1>=total){
                    val=total-1
                }
                if(val==total-1){
                    $('.btnRight').attr('disabled','disabled')
                }
                values=val+1+'/'+total
                $("#select").find("select").find("option[value = '"+values+"']").prop("selected",true).siblings().removeProp('selected')
                sendFetch(val-0+1)
                // uu.onclick=function(e){
                //     if(e.target.localName=='img'){
                //         var _this=e.target
                //         let id=_this.parentNode.getAttribute('productid')
                //         location.href='saveMoneyDetail.html?productid='+id
                //     }else if(e.target.localName=='p'){
                //         id=e.target.parentNode.parentNode.getAttribute('productid')
                //         location.href='saveMoneyDetail.html?productid='+id
                //     }
                // }
            })
            sel.onchange = function(){
                // let pageid=options[this.options.selectedIndex].getAttribute('pageid')
                val=$("#select").find("select").find('option:selected').attr("pageid");
                if(val==total-1){
                    $('.btnRight').attr('disabled','disabled')
                    $('.btnLeft').removeAttr('disabled')
                }else if(val==0){
                    $('.btnLeft').attr('disabled','disabled')
                    $('.btnRight').removeAttr('disabled')
                }else{
                    $('.btnLeft').removeAttr('disabled')
                    $('.btnRight').removeAttr('disabled')
                }
                values=(val-0)+1+'/'+total
                $("#select").find("select").find("option[value = '"+values+"']").prop("selected",true).siblings().removeProp('selected')
                sendFetch(val-0+1)
                // uu.onclick=function(e){
                //     if(e.target.localName=='img'){
                //         var _this=e.target
                //         let id=_this.parentNode.getAttribute('productid')
                //         location.href='saveMoneyDetail.html?productid='+id
                //     }else if(e.target.localName=='p'){
                //         id=e.target.parentNode.parentNode.getAttribute('productid')
                //         location.href='saveMoneyDetail.html?productid='+id
                //     }
                // }
            }
            
})
    ownPage.innerHTML=title
    ownPage.onclick=function(){
        location.reload()
    }
    var sendFetch=function(id){
        fetch('http://chst.vip:1234/api/getproductlist?categoryid='+categoryid+'&pageid='+id)
                    .then(body=>body.json())
                    .then(res=>{
                        let productStr = ""
                        res.result.forEach(item=>{
                            let regExp = /(\/|http)[^>]+\.(jpg|jpeg|png|gif)/g;
                    src = item.productImg.match(regExp)
                    src=src?src[0]:item.productImg
                    productStr += `<li productid=${item.productId}>
            <img src=${src} alt="">
            <div>
                <p>${item.productName}<br><span>${item.productPrice}</span></p>
                <div>
                    <span>${item.productQuote}</span>
                    <div>
                        <img src="../assets/images/讯息.png">
                        <span>${item.productCom}</span>
                    </div>
                </div>
            </div>
        </li>`
                        })
                        product.innerHTML = productStr
                    })
    }

})
